<template>
    <div class="page_root" :key="queryUpdateFlag" data-page-name="1" data-page-identification="x_hb0xe6o0k2">
        <a-spin :spinning="pageLoading.loading" :tip="pageLoading.tip">
            <!-- begin vid_q2pj193dfc 自定义模块_7xu4mdl9mj -->
            <!--          新建/编辑工作总结-->
            <a-modal
                :visible="weeklyState.workVisible"
                :title="weeklyState.workTitle"
                centered
                :ok-button-props="{ loading: weeklyState.okBtnLoading }"
                @ok="handleConfirmWork"
                width="774px"
                :body-style="{
                    paddingBottom: 0,
                    height: '700px',
                    overflowY: 'auto'
                }"
                @cancel="handleCancel"
                :maskClosable="false"
                destroy-on-close
            >
                <a-form :model="weeklyState.formModel" ref="formRef">
                    <div class="my-page">
                        <div class="form-top">
                            <a-row>
                                <a-col :span="12">
                                    <a-form-item
                                        label="区域名称"
                                        :rules="[{ required: true, message: '请选择区域名称！', trigger: 'blur' }]"
                                        name="regionId"
                                    >
                                        <a-select
                                            v-model:value="weeklyState.formModel.regionId"
                                            placeholder="请选择区域名称"
                                            :options="weeklyState.regionList"
                                            :field-names="{ label: 'regionName', value: 'id' }"
                                            :filterOption="
                                                (input, option) => {
                                                    return (
                                                        option.regionName.toLowerCase().indexOf(input.toLowerCase()) >=
                                                        0
                                                    )
                                                }
                                            "
                                        />
                                    </a-form-item>
                                </a-col>
                                <a-col :span="12">
                                    <a-form-item
                                        label="时间范围"
                                        :rules="[{ required: true, message: '请选择时间范围！', trigger: 'blur' }]"
                                        name="time"
                                    >
                                        <a-date-picker
                                            style="width: 200px"
                                            v-model:value="weeklyState.formModel.time"
                                            picker="week"
                                            :format="weekFormat"
                                            @change="handleAddWeekChange"
                                        />
                                    </a-form-item>
                                </a-col>
                            </a-row>
                        </div>

                        <div
                            class="module-item"
                            v-for="(item, index) in weeklyState.formModel.weekWorkSummaryDetailList"
                            :key="index"
                        >
                            <div class="form-content">
                                <a-form-item
                                    label="模块标题"
                                    :rules="[{ required: true, message: '请输入模块标题！', trigger: 'blur' }]"
                                    :name="['weekWorkSummaryDetailList', index, 'title']"
                                >
                                    <a-col :span="24">
                                        <a-input
                                            v-model:value="weeklyState.formModel.weekWorkSummaryDetailList[index].title"
                                            placeholder="请输入模块标题"
                                        />
                                    </a-col>
                                </a-form-item>
                                <a-form-item
                                    label="模块内容"
                                    :name="['weekWorkSummaryDetailList', index, 'content']"
                                    :rules="[{ required: true, message: '请输入模块内容！', trigger: 'blur' }]"
                                >
                                    <a-col :span="24">
                                        <a-textarea
                                            :rows="4"
                                            placeholder="请输入模块内容"
                                            v-model:value="
                                                weeklyState.formModel.weekWorkSummaryDetailList[index].content
                                            "
                                        />
                                    </a-col>
                                </a-form-item>
                            </div>
                            <a v-if="!currentData.taskId" class="del" @click="handlerDeleteFormItem(index)">删除</a>
                        </div>
                    </div>
                </a-form>
                <a-button v-if="!currentData.taskId" type="primary" ghost class="add-btn" @click="handlerAddFormItem">
                    <plus-outlined />
                    添加
                </a-button>
            </a-modal>
            <!--          新建/编辑工作总结-->
            <!--          删除工作总结-->
            <a-modal
                :visible="weeklyState.deleteVisible"
                title="删除"
                @ok="confirmDeleteWork"
                @cancel="weeklyState.deleteVisible = false"
                centered
            >
                确定删除这条周工作总结吗？
            </a-modal>
            <!--          删除工作总结-->
            <!--变更记录-->
            <a-modal
                :visible="weeklyState.changeVisible"
                title="变更记录"
                centered
                @cancel="weeklyState.changeVisible = false"
                :footer="null"
                width="1000px"
            >
                <div class="default-table">
                    <a-table
                        bordered
                        :columns="columns"
                        :data-source="weeklyState.changeRecord"
                        :scroll="{ y: 600 }"
                        :pagination="false"
                    />
                </div>
            </a-modal>
            <!--变更记录-->
            <div class="body">
                <div class="top-search">
                    <div>
                        <a-form-item label="时间范围">
                            <a-date-picker
                                style="width: 200px"
                                v-model:value="weeklyState.searchWeek"
                                picker="week"
                                :format="weekFormat"
                                @change="handleWeekChange"
                            />
                        </a-form-item>
                    </div>
                    <div>
                        <!--                        <a-button type="primary" @click="handleAddWork">新建</a-button>-->
                    </div>
                </div>
                <a-spin :spinning="weeklyState.spining" tip="加载中...">
                    <div class="content">
                        <div class="no-data-img" v-if="weeklyState.dataSource.length == 0">
                            <svg
                                xmlns="http://www.w3.org/2000/svg"
                                xmlns:xlink="http://www.w3.org/1999/xlink"
                                width="265px"
                                height="192px"
                                viewBox="0 0 265 192"
                                version="1.1"
                            >
                                <title>暂无待办事项</title>
                                <defs>
                                    <linearGradient
                                        x1="50%"
                                        y1="85.1278551%"
                                        x2="50%"
                                        y2="-24.3022005%"
                                        id="linearGradient-1"
                                    >
                                        <stop stop-color="#3875FF" stop-opacity="0" offset="0%" />
                                        <stop stop-color="#3875FF" stop-opacity="0.2" offset="100%" />
                                    </linearGradient>
                                    <linearGradient
                                        x1="50%"
                                        y1="85.1278551%"
                                        x2="50%"
                                        y2="-24.3022005%"
                                        id="linearGradient-2"
                                    >
                                        <stop stop-color="#3875FF" stop-opacity="0" offset="0%" />
                                        <stop stop-color="#3875FF" stop-opacity="0.2" offset="100%" />
                                    </linearGradient>
                                    <linearGradient
                                        x1="50%"
                                        y1="85.1278551%"
                                        x2="50%"
                                        y2="-24.3022005%"
                                        id="linearGradient-3"
                                    >
                                        <stop stop-color="#3875FF" stop-opacity="0" offset="0%" />
                                        <stop stop-color="#3875FF" stop-opacity="0.2" offset="100%" />
                                    </linearGradient>
                                    <linearGradient x1="50%" y1="50%" x2="50%" y2="-4.79965365%" id="linearGradient-4">
                                        <stop stop-color="#3875FF" stop-opacity="0" offset="0%" />
                                        <stop stop-color="#3875FF" stop-opacity="0.1" offset="100%" />
                                    </linearGradient>
                                    <linearGradient x1="100%" y1="50%" x2="0%" y2="50%" id="linearGradient-5">
                                        <stop stop-color="#9CBEF7" offset="0%" />
                                        <stop stop-color="#96D1F7" offset="100%" />
                                    </linearGradient>
                                    <linearGradient x1="100%" y1="50%" x2="0%" y2="50%" id="linearGradient-6">
                                        <stop stop-color="#9CBEF7" offset="0%" />
                                        <stop stop-color="#96D1F7" offset="100%" />
                                    </linearGradient>
                                </defs>
                                <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                    <g id="审批管理-暂无待办事项" transform="translate(-927, -470)">
                                        <g id="暂无待办事项" transform="translate(927, 470)">
                                            <g id="编组-69备份-3备份-3" fill-rule="nonzero">
                                                <path
                                                    d="M30.4,70.4 C38.3897145,70.4 44.9396432,76.4022329 45.5530639,84.0283112 C45.8323774,84.0092712 46.1150286,84 46.4,84 C53.027417,84 58.4,89.0144112 58.4,95.2 C58.4,101.385589 53.027417,106.4 46.4,106.4 C46.1313282,106.4 45.8647188,106.391759 45.6004459,106.375534 L45.6,107.2 L8.8,107.2 L8.80006856,105.99739 C3.72613437,104.690379 0,100.351322 0,95.2 C0,89.0144112 5.372583,84 12,84 C13.1159648,84 14.1963502,84.1421776 15.2214963,84.4081848 C15.6437054,76.6027782 22.2779069,70.4 30.4,70.4 Z"
                                                    id="形状结合备份"
                                                    fill="url(#linearGradient-1)"
                                                />
                                                <path
                                                    d="M174.4,35.2 L174.400166,35.1009906 C168.085987,34.3137074 163.2,28.9274454 163.2,22.4 C163.2,15.3307552 168.930755,9.6 176,9.6 C177.223344,9.6 178.406604,9.77161808 179.527019,10.0920919 C181.87653,4.17968127 187.650157,0 194.4,0 C202.141022,0 208.598072,5.49733733 210.080147,12.8010091 C216.449395,12.8415186 221.6,17.8400063 221.6,24 C221.6,30.0561716 216.621551,34.98966 210.40049,35.1934501 L210.4,35.2 L174.4,35.2 Z"
                                                    id="形状结合"
                                                    fill="url(#linearGradient-2)"
                                                    transform="translate(192.4, 17.6) scale(-1, 1) translate(-192.4, -17.6)"
                                                />
                                                <path
                                                    d="M242.8,47.2 C247.491543,47.2 251.362882,50.7117164 251.928816,55.249951 C252.214523,55.2167339 252.505192,55.2 252.8,55.2 C256.77645,55.2 260,58.2444637 260,62 C260,65.7555363 256.77645,68.8 252.8,68.8 C252.529676,68.8 252.262831,68.7859302 252.000242,68.7585236 L252,69.6 L229.6,69.6 L229.600068,68.6315132 C226.393652,67.9443906 224,65.2361993 224,62 C224,58.2444637 227.22355,55.2 231.2,55.2 C232.054514,55.2 232.874259,55.3405911 233.634718,55.5986176 C234.040539,50.892793 237.989021,47.2 242.8,47.2 Z"
                                                    id="形状结合备份-2"
                                                    fill="url(#linearGradient-3)"
                                                />
                                                <g id="编组-50" transform="translate(1.6, 76.8)">
                                                    <ellipse
                                                        id="椭圆形"
                                                        fill="url(#linearGradient-4)"
                                                        cx="131.6"
                                                        cy="57.6"
                                                        rx="131.6"
                                                        ry="57.6"
                                                    />
                                                    <g id="编组-46" transform="translate(30.4, 4.8)">
                                                        <rect
                                                            id="矩形"
                                                            fill="#D7E3FF"
                                                            x="6.4"
                                                            y="20"
                                                            width="2.4"
                                                            height="12"
                                                        />
                                                        <path
                                                            d="M8.4,21.5460356 C25.469423,21.5460356 11.8000002,-1.42108547e-14 8.4,-1.42108547e-14 C4.99999998,-1.42108547e-14 -8.66942296,21.5460356 8.4,21.5460356 Z"
                                                            id="椭圆形"
                                                            fill="#EAF0FF"
                                                        />
                                                    </g>
                                                    <g id="编组-46备份-2" transform="translate(218.4, 4.8)">
                                                        <rect
                                                            id="矩形"
                                                            fill="#D7E3FF"
                                                            x="4.97664"
                                                            y="13.824"
                                                            width="1.65888"
                                                            height="8.2944"
                                                        />
                                                        <path
                                                            d="M5.80608,14.8926198 C17.6044651,14.8926198 8.15616008,-9.8225428e-15 5.80608,-9.8225428e-15 C3.45599989,-9.8225428e-15 -5.99230512,14.8926198 5.80608,14.8926198 Z"
                                                            id="椭圆形"
                                                            fill="#EAF0FF"
                                                        />
                                                    </g>
                                                    <g id="编组-46备份" transform="translate(245.6, 21.6)">
                                                        <rect
                                                            id="矩形"
                                                            fill="#D7E3FF"
                                                            x="3.6"
                                                            y="10"
                                                            width="1.2"
                                                            height="6"
                                                        />
                                                        <path
                                                            d="M4.2,10.7730178 C12.7347114,10.7730178 5.90000008,-7.10542736e-15 4.2,-7.10542736e-15 C2.5,-7.10542736e-15 -4.33471146,10.7730178 4.2,10.7730178 Z"
                                                            id="椭圆形"
                                                            fill="#EAF0FF"
                                                        />
                                                    </g>
                                                </g>
                                            </g>
                                            <g id="编组-61" transform="translate(89.6, 21.6)">
                                                <ellipse
                                                    id="椭圆形"
                                                    fill="#E2EBFF"
                                                    fill-rule="nonzero"
                                                    cx="42.8"
                                                    cy="80"
                                                    rx="42.8"
                                                    ry="4.8"
                                                />
                                                <rect
                                                    id="矩形备份-91"
                                                    fill="url(#linearGradient-5)"
                                                    x="5.6"
                                                    y="0"
                                                    width="70.4"
                                                    height="80.8"
                                                    rx="3.2"
                                                />
                                                <g
                                                    id="编组-60"
                                                    transform="translate(20.8, 28)"
                                                    fill="#FFFFFF"
                                                    fill-rule="nonzero"
                                                >
                                                    <rect id="矩形" x="0" y="0" width="40" height="3.2" rx="1.6" />
                                                    <rect
                                                        id="矩形备份-92"
                                                        x="0"
                                                        y="15.2"
                                                        width="40"
                                                        height="3.2"
                                                        rx="1.6"
                                                    />
                                                    <rect
                                                        id="矩形备份-93"
                                                        x="0"
                                                        y="30.4"
                                                        width="40"
                                                        height="3.2"
                                                        rx="1.6"
                                                    />
                                                </g>
                                                <path
                                                    d="M21.6,0 L60.7346814,0 L55.7992343,8.40508424 C55.6555754,8.64973584 55.393086,8.8 55.1093744,8.8 L27.225307,8.8 C26.9415954,8.8 26.6791059,8.64973584 26.535447,8.40508424 L21.6,0 L21.6,0 Z"
                                                    id="矩形"
                                                    fill="#FFFFFF"
                                                    fill-rule="nonzero"
                                                />
                                                <rect
                                                    id="矩形备份-94"
                                                    fill="url(#linearGradient-6)"
                                                    x="29.6"
                                                    y="0"
                                                    width="23.2"
                                                    height="3.2"
                                                    rx="1.6"
                                                />
                                            </g>
                                        </g>
                                    </g>
                                </g>
                            </svg>
                            <div class="no-data-msg">暂无数据</div>
                        </div>
                        <div class="week-item" v-for="(item, index) in weeklyState.dataSource" :key="index">
                            <div class="item-title">
                                <div class="title-left">
                                    <div class="title-icon">
                                        <svg
                                            style="margin-top: 7px"
                                            xmlns="http://www.w3.org/2000/svg"
                                            xmlns:xlink="http://www.w3.org/1999/xlink"
                                            width="16px"
                                            height="16px"
                                            viewBox="0 0 16 16"
                                            version="1.1"
                                        >
                                            <title>区域名称</title>
                                            <g
                                                id="页面-1"
                                                stroke="none"
                                                stroke-width="1"
                                                fill="none"
                                                fill-rule="evenodd"
                                            >
                                                <g id="客户协作端2-区域列表" transform="translate(-264, -164)">
                                                    <g id="区域名称" transform="translate(264, 164)">
                                                        <rect id="矩形" x="0" y="0" width="16" height="16" />
                                                        <g
                                                            id="编组"
                                                            transform="translate(1, 2)"
                                                            stroke="#3875FF"
                                                            stroke-linecap="round"
                                                            stroke-linejoin="round"
                                                        >
                                                            <polygon
                                                                id="路径"
                                                                fill="#3875FF"
                                                                fill-rule="nonzero"
                                                                points="4.9 6.3 2.8 9.45 0 7.875 0 12.6 14 12.6 14 3.15 11.55 5.95 9.45 4.2 7 7"
                                                            />
                                                            <polyline
                                                                id="路径"
                                                                points="0 7.875 0 3.85 2.45 5.95 4.375 3.15 6.475 4.2 9.45 1.05 11.375 2.625 14 0 14 3.325"
                                                            />
                                                        </g>
                                                    </g>
                                                </g>
                                            </g></svg
                                        ><span class="title-name">{{ item.regionName }}</span></div
                                    >
                                    <div class="time-range normal-font">
                                        时间范围：
                                        <span class="weight-font"
                                            >{{ item.timeFrameList[0] }}--{{ item.timeFrameList[1] }}</span
                                        >
                                    </div>
                                    <div class="normal-font sub-time">
                                        最近提交时间：
                                        <span class="weight-font">{{ item.updateTime }}</span>
                                    </div>
                                    <div class="normal-font create-time">
                                        创建时间：
                                        <span class="weight-font">{{ item.createdTime }}</span>
                                    </div>
                                </div>
                                <div class="title-right">
                                    <a-space>
                                      看板展示： <a-switch @change="changeShow"/>
                                        <a-button type="primary" size="small" ghost @click="handleEdit(item)"
                                            >编辑</a-button
                                        >
                                        <a-button type="primary" size="small" ghost @click="handleDelete(item)"
                                            >删除</a-button
                                        >
                                        <a-button type="primary" size="small" ghost @click="handleCheck(item)"
                                            >变更记录</a-button
                                        >
                                    </a-space>
                                </div>
                            </div>
                            <div class="module" v-for="(module, index) in item.weekWorkSummaryDetailList">
                                <div class="module-title">
                                    <svg
                                        style="margin-right: 4px"
                                        xmlns="http://www.w3.org/2000/svg"
                                        xmlns:xlink="http://www.w3.org/1999/xlink"
                                        width="12px"
                                        height="12px"
                                        viewBox="0 0 12 12"
                                        version="1.1"
                                    >
                                        <title>椭圆形</title>
                                        <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                            <g
                                                id="客户协作端2-模版"
                                                transform="translate(-248, -246)"
                                                fill="#FFFFFF"
                                                stroke="#3875FF"
                                                stroke-width="2"
                                            >
                                                <g id="编组-3" transform="translate(248, 241)">
                                                    <circle id="椭圆形" cx="6" cy="11" r="5" />
                                                </g>
                                            </g>
                                        </g></svg
                                    >{{ module.title }}
                                </div>
                                <div class="module-content">
                                    <div v-for="(line, index) in module.content.split('\n')" :key="index">
                                        {{ line }}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </a-spin>
            </div>

            <!-- end vid_q2pj193dfc 自定义模块_7xu4mdl9mj -->
        </a-spin>
        <div class="pagination-div">
            <a-pagination
                v-model:current="pagination.current"
                :total="pagination.total"
                :page-size="pagination.pageSize"
                @show-size-change="pageSizeChange"
                @change="pageChange"
            />
        </div>
    </div>
</template>
<script setup lang="tsx">
    import {
        h,
        ref,
        reactive,
        toRaw,
        markRaw,
        watch,
        computed,
        onBeforeMount,
        onMounted,
        onBeforeUnmount,
        onUnmounted,
        onActivated,
        onDeactivated
    } from 'vue'
    import { useRoute, useRouter } from 'vue-router'
    const router = useRouter()
    const route = useRoute()
    import { get, post, put, del, request, requestWithHeaders } from '@/utils/http/Axios'
    import {
        cloneDeep,
        localGet,
        merge,
        getDifferenceArray,
        traversalTreeStructure,
        checkCaseCondition,
        renderStringInTemplate,
        handleBreadcrumbJump,
        throttle,
        permission,
        getComponentParamsValue
    } from '@/utils'
    import { isNullOrEmpty, isEmptyArr, isNullOrUnDef, isContained, isArray, isEmpty, isObject } from '@/utils/is'
    import dayjs from 'dayjs'
    import { getPagePcChartsDataSourceConvert } from '@/utils/chart'
    import { message, notification, Modal } from 'ant-design-vue'
    import { propertyFormatByNumber, propertyFormatByPercentage, propertyFormatByDate } from '@/utils/format'
    import colorTheme from '@/design/custom-theme.json'
    /*** PUBLISH_EXEGESIS ***
 import UserTableRecords from '@/model/UserTableRecords';
 import { getAppBaseUrl } from '@/utils/index';
 import { sendToken } from "@/hooks/useIframeToken";
 import { useSystemStore } from "@/store/modules/system";
 const systemStore = useSystemStore();
 *** PUBLISH_EXEGESIS ***/

    // 获取传入的流程ID和组件参数
    const props = defineProps({
        'processInstanceId': {
            type: [String, Number, Boolean],
            default: undefined
        }
    })
    const immediateWatch = (source, callback) => {
        watch(source, callback, { deep: true, immediate: true })
    }

    /* -------------------------- 属性定义 -------------------------- */

    const setTimeOutList = []
    const pageLoading = reactive({
        loading: false,
        tip: undefined
    })
    const authInfo = localGet('app-user-store')

    // 处理校验
    const setSubFormName = (parentInfo, name) => {
        return [parentInfo.parents, parentInfo.cycleIndex, name]
    }

    /* ========================== 属性定义 ========================== */

    /* -------------------------- 元素数据引用 -------------------------- */

    /* ========================== 元素数据引用 ========================== */

    /* -------------------------- 页面数据 -------------------------- */

    /* ========================== 页面数据 ========================== */

    /* -------------------------- 响应 -------------------------- */

    /* ========================== 响应 ========================== */

    /* -------------------------- 函数 -------------------------- */

    /* ========================== 函数 ========================== */

    /* -------------------------- 页面参数 -------------------------- */

    const pageParameter_state = reactive({
        'processInstanceId': props.processInstanceId ?? route.query.processInstanceId
    })

    /* ========================== 页面参数 ========================== */

    /* -------------------------- 组件事件处理方法 -------------------------- */

    // ---------------------------- 组件数据同步 ----------------------------

    // ============================ 组件数据同步 ============================

    /* ========================== 组件事件处理方法 ========================== */

    /* -------------------------- 生命周期 -------------------------- */
    // 用于参数变更后重新执行自定义指令
    const queryUpdateFlag = ref(0)
    onMounted(() => {})

    onUnmounted(() => {
        // 销毁定时器
        setTimeOutList.forEach(({ repeat, timer }) => {
            repeat ? clearInterval(timer) : clearTimeout(timer)
        })
    })

    /* ========================== 生命周期 ========================== */

    /* -------------------------- 数据关联处理 -------------------------- */

    /* -------------------------- 表单数据同步 -------------------------- */
    /* ========================== 表单数据同步 ========================== */

    /* ========================== 数据关联处理 ========================== */

    /* -------------------------- 不同组件自定义的处理逻辑 -------------------------- */

    /* ========================== 不同组件自定义的处理逻辑 ========================== */

    // ================================定制化逻辑========================================
    import isoWeek from 'dayjs/plugin/isoWeek'

    dayjs.extend(isoWeek)

    onMounted(() => {
        // 获取当前日期
        const today = dayjs()
        // 计算本周的周一和周日
        const startOfWeek = today.startOf('week').add(1, 'day').format('YYYY-MM-DD') // 周一
        const endOfWeek = today.endOf('week').add(1, 'day').format('YYYY-MM-DD') // 周日
        // 输出结果
        const currentWeekRange = [startOfWeek, endOfWeek]
        const s = dayjs(today).startOf('week').format('M月D日')
        const e = dayjs(today).endOf('week').format('M月D日')
        const timeFrame = [`${s}-${e}`]
        weeklyState.searchWeek = dayjs(startOfWeek)
        weeklyState.filterWeek = currentWeekRange
        getRegionList()
        getDataList()
    })
    const weeklyState = reactive({
        searchWeek: '',
        spining: false,
        filterWeek: [],
        dataSource: [],
        regionList: [],
        workVisible: false,
        deleteVisible: false,
        okBtnLoading: false,
        // 变更记录
        changeVisible: false,
        changeRecord: [],
        workTitle: '新建周工作总结',
        formModel: {
            time: '',
            timeFrameList: [],
            regionId: undefined,
            weekWorkSummaryDetailList: []
        }
    })
    const pageSizeChange = (current, size) => {
        pagination.value.current = current
        pagination.value.pageSize = size
        getDataList()
    }
    const pageChange = (page, pageSize) => {
        pagination.value.current = page
        pagination.value.pageSize = pageSize
        getDataList()
    }
    const pagination = ref({
        current: 1,
        pageSize: 10,
        showSizeChanger: true,
        total: '0',
        pageSizeOptions: ['20', '40', '60', '80', '100'],
        showTotal: total => `共 ${total} 条数据`
    })
    // 获取区域
    function getRegionList() {
        post('/solution-ppm/api/v2/built-in-system-ppm/cooperation/config_region/search ').then(data => {
            if (data.code !== 200) {
                message.error(data.message)
                return
            }
            weeklyState.regionList = data.data
        })
    }
    // 获取列表数据
    function getDataList() {
        weeklyState.spining = true
        post('/solution-ppm/api/v2/built-in-system-ppm/cooperation/week_work_summary/search ', {
            'pageNo': pagination.value.current,
            'pageSize': pagination.value.pageSize,
            'searchType': 'ALL',
            timeFrameList: weeklyState.filterWeek
        })
            .then(data => {
                if (data.code !== 200) {
                    message.error(data.message)
                    return
                }
                weeklyState.dataSource = data.data.dataList
                pagination.value.total = data.data.totalElements
            })
            .finally(() => {
                weeklyState.spining = false
            })
    }
    const columns = [
        {
            title: '所属模块',
            dataIndex: 'field'
        },
        {
            title: '变更前',
            dataIndex: 'before'
        },
        {
            title: '变更后',
            dataIndex: 'after'
        },
        {
            title: '变更人',
            dataIndex: 'updateBy'
        },
        {
            title: '变更时间',
            dataIndex: 'updateTime'
        }
    ]
    const moduleItem = {
        title: '',
        content: ''
    }

    const currentData = ref({})
    const backendDateRange = ['2024-08-26', '2024-09-01']

    // 解析后端返回的数据，提取开始日期并转换为 `dayjs` 对象
    // weeklyState.searchWeek = dayjs(backendDateRange[0])
    // 日期格式化
    const weekFormat = date => {
        const year = date.year()
        const month = date.month() + 1
        // 获取当月的第一天
        const firstDayOfMonth = dayjs(date).startOf('month')
        // 计算当前日期是本月的第几周
        const weekOfMonth = date.week() - firstDayOfMonth.week() + 1
        return `${year}年${month}月第${weekOfMonth}周`
    }
    // 筛选日期格式化
    const handleWeekChange = date => {
        if (date) {
            const startOfWeek = dayjs(date).startOf('isoWeek').format('YYYY-MM-DD')
            const endOfWeek = dayjs(date).endOf('isoWeek').format('YYYY-MM-DD')
            weeklyState.filterWeek = [startOfWeek, endOfWeek]
            getDataList()
        } else {
            weeklyState.filterWeek = []
            getDataList()
        }
    }
    // 新增/编辑日期格式化
    const handleAddWeekChange = date => {
        const startOfWeek = dayjs(date).startOf('isoWeek').format('YYYY-MM-DD')
        const endOfWeek = dayjs(date).endOf('isoWeek').format('YYYY-MM-DD')
        weeklyState.formModel.timeFrameList = [startOfWeek, endOfWeek]
    }
    // 新增总结
    function handleAddWork() {
        weeklyState.workVisible = true
        weeklyState.formModel.weekWorkSummaryDetailList.push({ ...moduleItem })
    }
    // 保存并提交
    const formRef = ref(null)
    function handleConfirmWork() {
        formRef.value
            .validate()
            .then(() => {
                weeklyState.okBtnLoading = true
                if (currentData.value.id) {
                    put(
                        '/solution-ppm/api/v2/built-in-system-ppm/cooperation/week_work_summary ',
                        weeklyState.formModel
                    )
                        .then(data => {
                            if (data.code !== 200) {
                                message.error(data.message)
                                return
                            }
                            message.success('修改成功')
                            weeklyState.workVisible = false
                            formRef.value.resetFields()
                            getDataList()
                        })
                        .finally(() => {
                            weeklyState.okBtnLoading = false
                        })
                } else {
                    post(
                        '/solution-ppm/api/v2/built-in-system-ppm/cooperation/week_work_summary',
                        weeklyState.formModel
                    ).then(data => {
                        if (data.code !== 200) {
                            message.error(data.message)
                            return
                        }
                        message.success('新建成功')
                        weeklyState.workVisible = false
                        getDataList()
                        formRef.value.resetFields()
                    })
                }
            })
            .catch(err => {
                console.error('Validation failed:', err)
            })
            .finally(() => {
                weeklyState.okBtnLoading = false
            })
    }
    //删除一个模块
    function handlerDeleteFormItem(index) {
        weeklyState.formModel.weekWorkSummaryDetailList.splice(index, 1)
        formRef.value.clearValidate() // 清除所有的表单校验
    }
    // 新插一条模块
    function handlerAddFormItem() {
        weeklyState.formModel.weekWorkSummaryDetailList.push({ ...moduleItem })
    }
    // 关闭新建
    function handleCancel() {
        weeklyState.workVisible = false
        formRef.value.resetFields()
    }
    // 确定删除
    function confirmDeleteWork() {
        del(`/solution-ppm/api/v2/built-in-system-ppm/cooperation/week_work_summary/${currentData.value.id}`).then(
            data => {
                if (data.code !== 200) {
                    message.error(data.message)
                    return
                }
                message.success('删除成功')
                weeklyState.deleteVisible = false
                getDataList()
            }
        )
    }
    //     变更记录
    function handleCheck(item) {
        post('/solution-ppm/api/v2/built-in-system-ppm/cooperation/week_work_summary/change_record/search ', {
            id: item.id
        }).then(data => {
            if (data.code !== 200) {
                message.error(data.message)
                return
            }
            weeklyState.changeRecord = data.data
            weeklyState.changeVisible = true
        })
    }
    //     删除
    function handleDelete(item) {
        currentData.value = item
        weeklyState.deleteVisible = true
    }
    //     编辑
    function handleEdit(item) {
        currentData.value = item
        weeklyState.formModel = cloneDeep(item)
        console.log(item)
        weeklyState.formModel.time = dayjs(item.timeFrameList[0])
        weeklyState.workVisible = true
    }
</script>
<style lang="less" scoped>
    .page_root :deep(.@{ant-prefix}-spin-nested-loading),
    .page_root :deep(.@{ant-prefix}-spin-container) {
        height: 100%;
    }
    .page_root :deep(.@{ant-prefix}-spin-container .@{ant-prefix}-table-wrapper) {
        display: flex;
        flex-flow: column nowrap;
        justify-content: flex-start;
    }
    .page_root :deep(.@{ant-prefix}-table) {
        flex: auto;
        overflow: auto;
    }
    .table-moreBtn_down {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 100px;
    }

    .table-moreBtn_menu :deep(.table-moreBtn_menu-item):hover {
        background: #ebf1ff;
    }

    /*  表格树结构样式处理，展开按钮层级增加*/
    :deep(.@{ant-prefix}-table-row-expand-icon) {
        z-index: 1;
    }
    /*  表格树结构 由于每个表格项采用自定义组件，使用绝对定位布局，开启树结构导致显示异常，暂时使用层级定位位置 */
    :deep(.@{ant-prefix}-table-row-level-1 .@{ant-prefix}-table-cell-with-append .cell-wrapper-left) {
        left: 15px !important;
        width: calc(100% - 15px);
    }
    :deep(.@{ant-prefix}-table-row-level-2 .@{ant-prefix}-table-cell-with-append .cell-wrapper-left) {
        left: 30px !important;
        width: calc(100% - 30px);
    }
    :deep(.@{ant-prefix}-table-row-level-3 .@{ant-prefix}-table-cell-with-append .cell-wrapper-left) {
        left: 45px !important;
        width: calc(100% - 45px);
    }
    :deep(.@{ant-prefix}-table-row-level-4 .@{ant-prefix}-table-cell-with-append .cell-wrapper-left) {
        left: 60px !important;
        width: calc(100% - 60px);
    }

    /* 穿梭框改变默认样式，为根据组件样式控制左右栏宽度。 */
    :deep(.@{ant-prefix}-transfer-list) {
        height: 100%;
        width: 50%;
    }
    /*样式*/
    .page_root {
        width: 100%;
        height: 100%;
        overflow: hidden;
    }
    .top-search {
        height: 64px;
        background-color: #fff;
        padding: 16px 24px;
        border-radius: 2px;
        margin-bottom: 16px;
        display: flex;
        justify-content: space-between;
    }
    .content {
        background-color: #fff;
        border-radius: 2px;
        padding: 24px;
        height: calc(100vh - 220px);
        overflow: auto;
        padding-bottom: 8px;
    }
    .week-item {
        padding: 16px;
        padding-top: 10px;
        box-shadow: 0 0 12px 0 rgba(229, 229, 229, 0.8);
        border-radius: 4px;
        margin-bottom: 16px;
    }
    .item-title {
        display: flex;
        justify-content: space-between;
        height: 40px;
        border-bottom: 1px solid #d9d9d9;
    }
    .title-left {
        display: flex;
        width: 55%;
        justify-content: space-between;
    }
    .title-icon {
        display: flex;
        font-size: 16px;
        color: #3875ff;
        font-weight: 500;
    }
    .title-name {
        margin-left: 8px;
        line-height: 30px;
    }
    .normal-font,
    .weight-font {
        font-size: 14px;
        color: #595959;
    }
    .weight-font {
        font-weight: 500;
        color: #262626;
    }
    .title-right {
        display: flex;
        padding-bottom: 15px;
    }
    .module-title {
        height: 20px;
        line-height: 20px;
        margin-top: 16px;
        margin-bottom: 12px;
        display: flex;
        color: #595959;
        align-items: center;
    }
    .module-content {
        background: #ffffff;
        border: 1px solid #d9d9d9;
        border-radius: 2px;
        padding: 6px 8px;
    }
    .time-range,
    .create-time,
    .sub-time {
        line-height: 32px;
    }
    .form-content {
        display: inline-block;
        width: calc(100% - 50px);
    }
    .del {
        width: 28px;
        color: #3875ff;
        float: right;
    }

    /deep/ .my-page .aps-form-item-label,
    /deep/ .my-page .ant3-form-item-label {
        width: 115px;
    }
    .form-top {
        border-bottom: 1px solid #3875ff;
        margin-bottom: 16px;
    }
    .module-item {
        border-bottom: 1px solid #3875ff;
        margin-bottom: 16px;
    }
    .no-data-img {
        width: 264px;
        height: 192px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    .no-data-msg {
        position: absolute;
        top: 60%;
        left: 50%;
        transform: translate(-50%, -50%);
        color: #595959;
    }
    .pagination-div {
        position: absolute;
        right: 30px;
        bottom: -10px;
        padding: 10px;
        background: transparent; /* 可选：为背景添加颜色 */
    }
    .default-table:deep(.@{ant-prefix}-table-thead) > tr > th {
        background-color: #3875ff;
        color: #fff;
        font-weight: 600;
        padding: 8px 16px;
        border-right: 1px solid #d9d9d9;
    }
    .default-table :deep(.@{ant-prefix}-table-tbody) tr > td {
        font-size: 14px;
        font-family: arial, helvetica, 'microsoft yahei';
        font-weight: 400;
        color: #595959;
        border-bottom: 1px solid #d9d9d9;
        padding: 8px 16px;
        word-break: break-all;

        .cell-wrapper {
            padding: 0 16px;
        }
    }
</style>
